<template>
    <!-- 
        页面以 QS （勤瘦） 为主命名
        每个页面再根据页面内容，添加不同命名后续 （如登录页 - loading）
        页面内命名都以本页面主题为开头，加功能后缀 如：loading-confirm-btn
        本页面主题:control
     -->
    <div class="QS-control">
        <!-- 操作台 -->
        <div class="control_tab">
            <div class="control_icon">
                <img src="../assets/image/icon.png" alt="">
                <p>勤瘦小程序</p>
            </div>
            <div class="control_console">
                <el-menu
                    :default-active="defaultActive"
                    class="el-menu-vertical-demo control_console_menu"
                    @open="handleOpen"
                    @close="handleClose"
                    background-color="#133259"
                    text-color="#fff"
                    active-text-color="#ffd04b"
                >
                    <el-submenu index="1">
                        <template slot="title">
                            <i class="el-icon-user"></i>
                            <span>用户信息</span>
                        </template>
                        <el-menu-item-group>
                            <el-menu-item @click="userInfo()" index="1-1">用户信息查询</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                    <el-submenu index="2">
                        <template slot="title">
                            <i class="el-icon-setting"></i>
                            <span>页面设置</span>
                        </template>
                        <el-menu-item-group>
                            <el-menu-item @click="publicInfo()" index="2-1">公共信息配置</el-menu-item>
                            <!-- <el-menu-item @click="homePage()" index="2-2">首页</el-menu-item> -->
                            <el-menu-item @click="information()" index="2-3">资讯</el-menu-item>
                            <el-menu-item @click="makeFoods()" index="2-4">自由日食谱</el-menu-item>
                            <!-- <el-menu-item @click="sharePage()" index="2-5">分享页设置</el-menu-item> -->
                            <el-menu-item @click="exchangeMall()" index="2-6">兑换商城</el-menu-item>
                            <el-menu-item @click="problemAndHelp()" index="2-7">常见问题及帮助</el-menu-item>
                            <el-menu-item @click="sendMessage()" index="2-8">推送短信</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </div>
        </div>
        <!-- 内容部分 -->
        <div class="control_cont">
            <div class="control_userInfo">
                <img src="../assets/image/userPic.png" alt="" class="control_userPic">
                <p class="control_userName">
                    勤瘦
                </p>
                <p @click="outOfLoading" class="control_userName">
                    退出登录
                </p>
            </div>
            <div class="control_view">
                <router-view></router-view>
            </div>
        </div>
    </div>
</template>

<script>

export default {
	components: {
	
	},
	data(){
		return {
            url:'',
            defaultActive:'1-1',
		}
    },
    mounted(){
        var _userName = sessionStorage.getItem("QS_userName");
        if(!_userName){
            this.$router.push('/QSLoading');
        }

        this.url = window.location.href;
        if(this.url.indexOf('QSUserInfo') != -1)this.defaultActive = '1-1';
        if(this.url.indexOf('QSPublicInfo') != -1)this.defaultActive = '2-1';
        if(this.url.indexOf('QSHomePage') != -1)this.defaultActive = '2-2';
        if(this.url.indexOf('QSInformationList') != -1)this.defaultActive = '2-3';
        if(this.url.indexOf('QSFoodsList') != -1)this.defaultActive = '2-4';
        if(this.url.indexOf('QSShareSetting') != -1)this.defaultActive = '2-5';
        if(this.url.indexOf('QSExchangeMall') != -1)this.defaultActive = '2-6';
        if(this.url.indexOf('QSProblemAndHelp') != -1)this.defaultActive = '2-7';
        if(this.url.indexOf('QSSendMessage') != -1)this.defaultActive = '2-8';
    },
    methods:{
        // this.$router.push('/GDPLHasReturned');
        handleOpen(key, keyPath) {
            console.log(key, keyPath);
        },
        handleClose(key, keyPath) {
            console.log(key, keyPath);
        },
        userInfo(){
            this.$router.push('/QSUserInfo');
        },
        publicInfo(){
            this.$router.push('/QSPublicInfo');
        },
        homePage(){
            this.$router.push('/QSHomePage');
        },
        information(){
            this.$router.push('/QSInformationList');
        },
        makeFoods(){
            this.$router.push('/QSFoodsList');
        },
        outOfLoading(){
            sessionStorage.clear();
            this.$router.push('/QSLoading');
        },
        sharePage(){
            this.$router.push('/QSShareSetting');
        },
        exchangeMall(){
            this.$router.push('/QSExchangeMall');
        },
        problemAndHelp(){
            this.$router.push('/QSProblemAndHelp');
        },
        sendMessage(){
            this.$router.push('/QSSendMessage');
        }
    }
}
</script>